<?php
include 'user_update_lib.php';
$a_UserID = get_user_info($f_userid, $db_conn);
?>
<div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
    <h3>Cập Nhật Ngày Thêm Sức</h3>
</div>
<form id="form_confirmation_date_modal" action="user_update_execute.php?action=update-confirmation-date" method="post">
    <div class="modal-body">
        <div class="alert alert-error hide">
            <button class="close" data-dismiss="alert"></button>
            Kiểm tra lại thông tin bên dưới.
        </div>
        <div class="row-fluid">
            <div class="span12 ">
                <div class="control-group">
                    <div class="controls">
                        <?php foreach ($a_UserID as $s_Tmp_UserID => $O_User) { ?>
                            <a class="btn mini rm-user" href="#">
                                <?= $O_User->saint ?> <?= $O_User->username ?> <i class="icon-remove"></i>
                                <input type="hidden" name="userid[<?= $s_Tmp_UserID ?>]" value="<?= $s_Tmp_UserID ?>" />
                            </a>
                        <?php } ?>
                    </div>
                </div>
            </div>
        </div>
        <div class="row-fluid text-center">
            <div class="span12 ">
                <div class="control-group">
                    <div class="controls text-center">
                        <input type="text" name="confirmation_date" id="confirmation_date" class="m-wrap datepicker text-center" placeholder="24-12-0000">
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="modal-footer">
        <button type="button" data-dismiss="modal" class="btn">Thoát</button>
        <button type="submit" class="btn blue btn-save">Lưu</button>
    </div>
</form>
<script type="text/javascript">
    var frm_confirmation_date = $('#form_confirmation_date_modal');
    var err_confirmation_date = $('.alert-error', frm_confirmation_date);

    frm_confirmation_date.validate({
        errorElement: 'span', //default input error message container
        errorClass: 'help-block', // default input error message class
        focusInvalid: false, // do not focus the last invalid input
        ignore: "",
        rules: {
            confirmation_date: {
                required: true
            }
        },
        messages: {
            confirmation_date: {
                required: 'Bắt buộc nhập'
            }
        },
        invalidHandler: function (event, validator) { //display error alert on form submit              
            err_confirmation_date.show();
            App.scrollTo(err_confirmation_date, -200);
        },
        highlight: function (element) { // hightlight error inputs
            $(element)
            .closest('.help-inline').removeClass('ok'); // display OK icon
            $(element)
            .closest('.control-group').removeClass('success').addClass('error'); // set error class to the control group
        },
        unhighlight: function (element) { // revert the change done by hightlight
            $(element)
            .closest('.control-group').removeClass('error'); // set error class to the control group
        },
        success: function (label) {
            label
            .closest('.control-group').removeClass('error').addClass('success').end()
            .remove(); // set success class to the control group
        },
        submitHandler: function (form) {
            err_confirmation_date.hide();
            
            var tmp_string = $('#confirmation_date', frm_confirmation_date).val();
            if (tmp_string != '') {
                $('#confirmation_date', frm_confirmation_date).parent().append('<span>'+tmp_string+'<span>');
                
                tmp_string = new Date(tmp_string.replace(/(\d+)-(\d+)-(\d+)/, '$3-$2-$1'));
                $('#confirmation_date', frm_confirmation_date).val($.datepicker.formatDate('yy-mm-dd', tmp_string)).hide();
            }
            
            $('.modal-footer', frm_confirmation_date).html('<img src="assets/img/loading.gif"/>');
            
            $.ajax({
                url: $(form).attr('action'),
                type: $(form).attr('method'),
                data: $(form).serialize(),
                dataType: 'json'
            })
            .done(function(response) {
                
                if (response.code == 200) {
                    $('.modal-footer', frm_confirmation_date).html(' <span>Đã Cập Nhật<span>');
                }
                else {
                    $('.modal-footer', frm_confirmation_date).html(' <span>Lỗi<span>');
                }
            });
        }
    });
    
    frm_confirmation_date.find('.rm-user').click(function () {
        $(this).remove();
    });
    
    $(".datepicker").datepicker();
</script>